<!--系统管理 --- 组织机构 --- 机构管理 -->
<template>
  <div class="department" id="department">
    <!-- 右侧 -->
    <div class="department_right">
      <div class="app-container-btn">
        <el-button type="primary" @click="saveFrom()">保存</el-button>
        <el-button @click="goBack">返回</el-button>
      </div>
      <!-- 表格 -->
      <div class="text_table TensionRealTime">
        <el-table
          ref="multipleTable"
          :data="tableData"
          style="width: 100%"
          height="100%"
          lazy
          :load="treeLoad"
          :tree-props="{ children: 'children', hasChildren: 'fHaschildren' }"
          row-key="fNodeid"
          v-loading="loading"
          element-loading-text="拼命加载中"
          element-loading-spinner="el-icon-loading"
          element-loading-background="rgba(0, 0, 0, 0.2)"
          :row-class-name="tableRowClassName"
          border
          stripe
          highlight-current-row
          @current-change="handleCurrentChange"
        >
          <!-- @row-click="getRowInfo" -->
          <el-table-column
            fixed
            type="index"
            label="序号"
            width="50"
            align="center"
          ></el-table-column>
          <el-table-column
            prop="fName"
            label="工程部位"
            min-width="100"
            style="display: flex"
          >
            <template slot-scope="scope">
              <a href="javascript:;" :title="scope.row.fName">
                {{ scope.row.fName }}
              </a>
            </template>
          </el-table-column>

          <el-table-column
            prop="fStartstationtype"
            label="开始桩号类型"
            align="center"
            width="150"
          >
            <template slot-scope="scope">
              <a href="javascript:;" :title="scope.row.fStartstationtype">
                {{ scope.row.fStartstationtype }}
              </a>
            </template>
          </el-table-column>
          <el-table-column
            prop="fStartstationkilometers"
            label="开始桩号公里数"
            align="center"
            width="110"
          >
            <template slot-scope="scope">
              <a href="javascript:;" :title="scope.row.fStartstationkilometers">
                {{ scope.row.fStartstationkilometers }}
              </a>
            </template>
          </el-table-column>
          <el-table-column
            prop="fStartstationmeters"
            label="开始桩号长度(米)"
            align="center"
            width="120"
          >
            <template slot-scope="scope">
              <a href="javascript:;" :title="scope.row.fStartstationmeters">
                {{ scope.row.fStartstationmeters }}
              </a>
            </template>
          </el-table-column>

          <el-table-column
            prop="fEndstationtype"
            label="结束桩号类型"
            align="center"
            width="150"
          >
            <template slot-scope="scope">
              <a href="javascript:;" :title="scope.row.fEndstationtype">
                {{ scope.row.fEndstationtype }}
              </a>
            </template>
          </el-table-column>
          <el-table-column
            prop="fEndstationkilometers"
            label="结束桩号公里数"
            align="center"
            width="110"
          >
            <template slot-scope="scope">
              <a href="javascript:;" :title="scope.row.fEndstationkilometers">
                {{ scope.row.fEndstationkilometers }}
              </a>
            </template>
          </el-table-column>
          <el-table-column
            prop="fEndstationmeters"
            label="结束桩号长度(米)"
            align="center"
            width="120"
          >
            <template slot-scope="scope">
              <a href="javascript:;" :title="scope.row.fEndstationmeters">
                {{ scope.row.fEndstationmeters }}
              </a>
            </template>
          </el-table-column>

          <!-- <el-table-column
            prop="StationLength"
            label="桩号长度"
            align="center"
            min-width="100"
          >
            <template slot-scope="scope">
              <a href="javascript:;" :title="scope.row.StationLength">
                {{ scope.row.StationLength }}
              </a>
            </template>
          </el-table-column> -->
          <el-table-column
            prop="fWbsstructuretype"
            label="结构类型"
            align="center"
            width="110"
          >
            <template slot-scope="scope">
              <a href="javascript:;" :title="scope.row.fWbsstructuretype">
                {{ scope.row.fWbsstructuretype }}
              </a>
            </template>
          </el-table-column>
        </el-table>
      </div>
    </div>
  </div>
</template>

<script>
import { getWbsList } from "@/api/request.js";

export default {
  name: "Tension_task_list_tree",
  computed: {},
  data() {
    return {
      name: "Tension_task_list_tree",

      tableData: [],
      loading: false,
      formLabelWidth: "90px",
      fCompanyid: "", //当前行的机构id
      fParentid: "", //父级id
      fNatureList: "", //机构性质树
      WbsRow: null, //选中行
      token: "", //获取token
      companyTree: [],
      formData: null,
      primaryInfo:"",
    };
  },
  created() {},
  mounted() {
    this.companyTree = [];
    this.getToken();
    this.primaryInfo = JSON.parse(sessionStorage.getItem("GxEmbedded_TWbsQuery"))

    // 
    // this.btnRole(this.name);
  },
  // beforeRouteLeave(to, form, next) {
  //   to.meta.keepAlive = true;
  //   next(0);
  // },
  methods: {
    goBack() {
      this.$router.back();
    },
    saveFrom() {
      if (this.WbsRow != null) {
        // if (this.WbsRow.fHaschildren == 0) {
          this.$router.push({
            path: "/groutManage/groutTaskListDetails",
          });
          window.sessionStorage.setItem(
            "GxEmbedded_Grout_Wbs_Deta",
            JSON.stringify(this.WbsRow)
          );

          if (JSON.parse(sessionStorage.getItem("GxEmbedded_GWbsQuery"))) {
            var query = {
              fId: "",
              fCompanyid: JSON.parse(sessionStorage.getItem("GxEmbedded_GWbsQuery")).fCompanyid,
              num: "改变",
            };
            window.sessionStorage.setItem("GxEmbedded_GWbsQuery", JSON.stringify(query));
          }
        // } else {
        //   this.$MessageBox.alertConfirmReminder("请选中最底层节点！");
        // }
      }
    },
    // 行颜色
    tableRowClassName({ row }) {
      if (
        (row.fParentid == 0 && !row.children) ||
        (row.fParentid == null && !row.children)
      ) {
        return "fristColor";
      }
    },
    async getToken() {
      await this.$http(
        " http://172.18.5.31:8300/IOTManagement/roadApi/getToken.do"
      ).then((res) => {
        if (res.status == 200) {
          // window.sessionStorage.setItem("GxEmbedded_token", JSON.stringify(token));
          localStorage.setItem("GxEmbedded_token", res.data.data.Authorizations);
          this.getWbsDataFun(this.$route.query.secId.fCompanyid, "");
        }
      });
    },
    getWbsDataFun(id, num) {
      console.log(2222);
      this.tableData=[];
      this.loading = true;
      getWbsList({
        // fCompanyid: id, //云检的标段Id
        // fNodeId: num, //WBS节点Id（对应返回数据中的NodeId字段），该参数可以不传或为空（不传或为空代表的是获取第一层的WBS数据），如果该参数传了值，则代表的是获取该节点的下一层的所有数据
        // keyWord: "", //工程部位查询关键字
        fCompanyid: id, //标段id 必填
                    projectId: this.primaryInfo.getList.fprojectid, //项目id 必填
                    parentId: "-1" //父级id 第一级传-1  子级取上一级fId或fNodeid 必填
      })
        .then((res) => {
          if (res.errcode == 0) {
            this.tableData = res.data.data;
            this.loading = false;
          } else {
            this.$message.error(res.msg);
          }
        })
        .catch((error) => {
          this.$message.error(error.msg);
          this.loading = false;
        });
    },

    treeLoad(tree, treeNode, resolve) {
      // console.log(tree, treeNode, resolve);
      getWbsList({
        fCompanyid: this.$route.query.secId.fCompanyid, //云检的标段Id
        fNodeId: tree.fNodeid, //WBS节点Id（对应返回数据中的NodeId字段），该参数可以不传或为空（不传或为空代表的是获取第一层的WBS数据），如果该参数传了值，则代表的是获取该节点的下一层的所有数据
        keyWord: "", //工程部位查询关键字
      })
        .then((res) => {
          if (res.errcode == 0) {
            return resolve(res.data.data);
          } else {
            this.$message.error(res.msg);
          }
        })
        .catch((error) => {
          this.$message.error(error.msg);
          this.loading = false;
        });
    },

    // 点击当前行变色
    handleCurrentChange(val) {
      this.WbsRow = val;
      console.log(val);
    },
    // btnRole(name) {
    //   var btnList = [];
    //   var ModuleList = JSON.parse(sessionStorage.getItem("GxEmbedded_ModuleList"));
    //   if (ModuleList.length > 0) {
    //     ModuleList.map((item) => {
    //       if (item.fEncode == name) {
    //         btnList = item.modulebuttonList;
    //       }
    //     });
    //     var btnStr = [];
    //     btnList.map((item) => {
    //       btnStr.push(item.fEncode);
    //     });

    //     this.lr_add = btnStr.includes("lr_add");
    //     this.lr_edit = btnStr.includes("lr_edit");
    //     this.lr_delete = btnStr.includes("lr_delete");
    //   } else {
    //     this.lr_add = true;
    //     this.lr_edit = true;
    //     this.lr_delete = true;
    //   }
    // },
  },
};
</script>

<style scoped lang='less'>
a {
  text-decoration: none;
  color: #000;
}
</style>